همونطور که خاطرتون هست، در جلسه قبل در مورد Code coverage اطلاعاتی رو در اختیارتون قرار دادیم و با مثالها و تصاویری که قرار دادیم، شما رو بصورت کامل با اون و ویژگی هاش آشنا کردیم. در این جلسه میخوایم نحوه اضافه کردن پروژه های مورد نظرمون به Workspace رو توضیح بدیم و با این ویژگی میتونیم Inspector یا DevTools رو به یک ویرایشگر قدرتمند تبدیل کنیم. فرض کنید که شما روی یک پروژه کار میکنید. همونطور که
همونطور که اطلاع دارید در جلسه قبل در مورد Destructuring در اشیاء یا object ها توضیحاتی رو قرار دادیم و شما رو بصورت کامل با اونا آشنا کردیم. در این قسمت قصد داریم در مورد Destructuring در آرایه ها بحث کنیم. Destructuring در آرایه ها بسیار شبیه به Destructuring در اشیاء است. درون اشیاء با استفاده از نام ویژگی، به مقادیر مورد نظر دسترسی پیدا میکردیم. اما در آرایه ها دیگه چنین چیزی وجود نداره و با ا
همونطور که اطلاع دارید در جلسه گذشته تابع showError رو تکمیل کردیم و ارور مربوط به هر فیلد رو در صورت وجود در زیر اون فیلد نمایش دادیم. همچنین یک استایل قرمز رنگ نیز برای border و متن پیام قرار دادیم تا ظاهر بهتری داشته باشد. در این جلسه میخوایم کدها رو ادامه بدیم و امکانات جدیدی رو به اون اضافه کنیم.
مخفی کردن پیام ارور
زمانی که کاربر به هر دلیلی یک ارور رو در زیر فیلد میبینه، سعی میکنه اون رو بر
برچسب: اعتبارسنجی,اعتبارسنجی, نویسنده: استخدام کار تاريخ: جمعه 31 شهريور 1396 ساعت: 6:54
در این قسمت میخوام یک کد ( Load more content ) جالب رو در اختیارتون بزارم.
همونطور که دیدید تعدادی آیتم بصورت لیستی قرار داده شده اند و زمانی که بر روی دکمه Load More کلیک میکنید، محتوای جدید با استایلی زیبا لود میشن و نمایش داده میشن. اگر صفحه اسکرول عمودی داشته باشه، همزمان با لود شدن محتوای جدید، صفحه نیز به سمت پایین اسکرول میشه و حالات جالبی رو به وجود میاره.
بدلیل اینکه حجم کدها زیاد بود ، ا
در این قسمت میخوام یک کد ( Audio Visualizer2 ) جالب رو در اختیارتون بزارم.
همونطور که دیدید یک دایره با استفاده از Three.js ساخته شده و قرار گرفته. با استفاده از دکمه choose a mp3 file در بالا و سمت چپ صفحه میتونین یک صدا یا موسیقی رو انتخاب کنید و زمانی که صدا پخش میشه، این دایره به زیبایی عکس العمل نشون میده و حالت جالبی رو به وجود میاره.
بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطل
در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون بهترین و محبوب ترین طراحی های در زمینه Material Design رو قرار داده و شما با دیدن اونا میتونین ایده های زیادی برای طراحی بگیرید و از اونا استفاده کنید. برای هر طرح یک gif قرار داده شده که نحوه عملکرد اون رو نمایش میده و با کلیک بر روی هر کدام به صفحه مختص به اون هدایت میشید و میتونین اطلاعات بیشتری در مورد اون کسب کنید.
برای شروع وارد سایت Mate
همونطور که اطلاع دارید در جلسات گذشته ترفندهای بسیار زیادی رو برای Inspector مرورگر Chrome قرار دادیم و شما رو با ویژگی ها و امکاناتی که در اختیارتون قرار میده رو آشنا کردیم. از این جلسه به بعد سعی میکنیم در مورد ویژگی هایی که جدید به Inspector اضافه میشه و یا ویژگی هایی که اصلا در موردشون بحث نشده، آموزش هایی رو قرار بدیم. در این جلسه میخوایم Code Coverage، امکانی که اخیرا توسط Chrome اضافه شده
همونطور که اطلاع دارید در جلسه گذشته تابع hasError رو تکمیل کردیم و متناسب با هر حالت، یک ارور قرار دادیم تا ارور و مشکل رو به خوبی به کاربر بفهمونیم. در جلسه قبل متن ارور ها رو در Console چاپ کردیم ولی در این جلسه میخوایم کاری کنیم که ارورها بجای چاپ شدن در Console در زیر همون فیلدی که مشکل داره، نمایش داده بشه.
نمایش متن ارور
همونطور که در جلسه قبل دیدید، به ارورهای موجود با استفاده از تابع has
برچسب: اعتبارسنجی,اعتبارسنجی, نویسنده: استخدام کار تاريخ: پنجشنبه 30 شهريور 1396 ساعت: 9:11
همونطور که خاطرتون هست، در جلسه پیش در مورد متدهای جدید اضافه شده به آرایه ها براتون توضیحاتی رو قرار دادیم. در این جلسه میخوایم در مورد Destructuring در اشیاء براتون توضیحاتی رو قرار بدیم و با مزایا و ویژگی هایی که داره، آشناتون بکنیم. Destructuring به معنی استخراج کردن اطلاعات کوچکتر از آرایه، اشیاء و ... است و میتونیم اطلاعات رو درون متغیر مورد نظرمون ذخیره سازی کنیم. میتونیم از Destructuring
همونطور که میدونین در جلسه قبل توضیحاتی در مورد غیر فعال کردن اعتبارسنجی ذاتی فرمها با استفاده از ویژگی novalidate دادیم. همچنین شما رو با رویداد blur و تکنیک Event Bubbling آشنا کردیم. در این جلسه میخوایم این موضوع رو ادامه بدیم.
همونطور که خاطرتون هست در جلسه قبل از کد زیر استفاده کردیم:
document.addEventListener('blur', function (event) { // Do something
برچسب: اعتبارسنجی,اعتبارسنجی, نویسنده: استخدام کار تاريخ: چهارشنبه 29 شهريور 1396 ساعت: 18:22
در این قسمت میخوام یک کد ( chessboard vacuum ) جالب رو در اختیارتون بزارم.
همونطور که دیدید یک صفحه شطرنج قرار گرفته و بصورت دوره ای یک حالت خلاء مانند در مرکز به وجود میاد و خانه های شطرنج به زیبایی جابجا میشن و انیمیشن دیدنی رو به وجود میارن. این کار با استفاده از CSS خالص به وجود اومده و میتونین از اون ایده بگیرید.
بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین
همونطور که اطلاع دارید در جلسات گذشته با کلاسها و امکانات و قابلیتهای اونا بصورت مقدماتی آشنا شدیم. در این جلسه قصد داریم در مورد انواع روشهای ساخت آرایه با هم بحث کنیم و تفاوت اونا رو با استفاده از مثالهای متنوع متوجه بشیم. همونطور که می دونید آرایه ها بخش بسیار مهمی از هر زبان برنامه نویسی از جمله javascript هستند و هر برنامه نویسی باید به خوبی با اونا آشنا باشه. در آرایه ها نیز همانند دیگر اجز
در این مطلب میخوام سایتی رو بهتون معرفی کنم که در محیط Photoshop با استفاده از 13 دایره کوچک و بزرگ و با تقاطع اونا، 13 حیوان مختلف رو به وجود آورده که میتونین از اون ایده بگیرید و هر حیوان یا چیز دیگه ای رو که بخواید طراحی کنید. این آموزش بصورت مرحله به مرحله این کار رو به شما آموزش میده. در آخر آموزش نیز 13 حیوان ساخته شده به این روش رو به علاوه دایره هایی که اون رو به وجود آوردن قرار داده و میت
همونطور که اطلاع دارید در جلسه گذشته در مورد روشهای مختلف تعریف آرایه توضیحاتی رو قرار دادیم و شما رو با متدهای Array.of و Array.from آشنا کردیم. در این جلسه میخوایم با متدهای جدیدی که برای آرایه ها اضافه شده و امکاناتی که در اختیار ما قرار میدن، آشنا بشیم.
متدهای find و findIndex
جستجوی المنت و عضوی خاص در یک آرایه در ES5 دردسرهای زیادی داشت و راه مشخص و از پیش تعریف شده ای برای اون وجود نداشت و
همونطور که اطلاع دارید در جلسه گذشته توضیحاتی در مورد اعتبارسنجی فرمها با استفاده از Javascript دادیم و در این جلسه قصد داریم این موضوع رو ادامه بدیم. آخرین کدی که در جلسه قبل قرار دادیم بصورت زیر بود:
1234567891011
var hasError = function (field) { // Get the error};document.addEventListner('blur', function (event) { if (!event.target.form.classList.cont
برچسب: اعتبارسنجی,اعتبارسنجی, نویسنده: استخدام کار تاريخ: چهارشنبه 29 شهريور 1396 ساعت: 18:22
هاست لینوکس محبوب ترین سرویس میزبانی وب در ایران است. مجموعه میزبان فا نیز بصورت کامل و حرفه ای بر روی ارائه سرویس های میزبانی وب لینوکس تمرکز کرده است. سرویس های متنوعی در حوزه میزبانی وب لینوکس در میزبان فا ارائه می شود که سرویس های هاست شگفت انگیز میزبان فا با دامنه و قالب رایگان جزو محبوب ترین سرویس ها محسوب می شود. همه چیز در هاست شگفت انگیز میزبان فا بصورت ویژه در نظر گرفته شده است.
ویژگی ه
در جلسه دهم این دوره آموزشی می پردازیم به طراحی دهمینپروژه این دوره و نکات و تکنیک های جالبی رو مورد بررسی و پیاده سازی قرار خواهیم داد
در این جلسه می پردازیم به :
نحوه گروه بندی لایه ها توسط پوشه ها
تکنیک ایجاد سایه برای عناصر موجود در طرح
و...
پروژه این جلسه :
info توجه
این مطلب یک جلسه از دورهدوره مجازی خلق تصاویر ترکیبی پیشرفته و Photo Manipulation در فت
همونطور که میدونین در جلسه قبل توضیحاتی مقدماتی در مورد اعتبارسنجی با استفاده از Javascript API خدمتتون دادیم و شما رو با ویژگی validity آشنا کردیم و اطلاعات مفیدی که در اختیارمون میزاره رو با هم بررسی کردیم. در این جلسه میخوایم مثالهای عملی رو با هم شروع کنیم.
غیرفعال کردن اعتبارسنجی ذاتی فرمها
بخاطر اینکه ما قصد داریم اعتبارسنجی فرمها رو سفارش سازی کنیم و مطابق با سلیقه خودمون اینکار رو انجام ب
برچسب: اعتبارسنجی,جلسه,اعتبارسنجی,قسمت, نویسنده: استخدام کار تاريخ: دوشنبه 27 شهريور 1396 ساعت: 20:56

در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون کار با واقعیت مجازی در سطح وب و مرورگر رو بصورت مقدماتی به شما آموزش میده و با مطالعه اون و بهره گیری از مثالهای متنوع، میتونین چیزای زیادی رو یاد بگیرید. در این آموزش از Three.js برای ساخت فضای سه بعدی استفاده شده است و از صدا و صوت نیز مورد استفاده قرار گرفته است.
برای شروع وارد سایت WebVR بشین.
امیدوارم بدردتون بخوره.
موفق باشید.
یا علی
در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون یک پلاگین مربوط به نرم افزار Sketch رو قرار داده و میتونین اون رو دانلود کرده و بر روی Sketch نصب کنید و به راحتی سایتهای واکنشگرا رو طراحی کرده و همه سایزها رو به خوبی مدیریت کنید. این پلاگین قابلیتهای زیادی رو در اختیارتون قرار میده. برای دانلود این پلاگین باید ایمیلتون رو در باکس مورد نظر وارد کرده و بر روی دکمه Download کلیک کنید. برای آموز
همونطور که اطلاع دارید در جلسه قبل در مورد ویژگی های Perspective و Position و Resize توضیحاتی رو قرار دادیم و شما رو با استفاده از مثال با اونا آشنا کردیم. در این جلسه قصد داریم در مورد ویژگی white-space که یک ویژگی کاربردی و مفید هست، بیشتر آشناتون کنیم. این ویژگی شاید برای خیلی از کسانی که تازه طراحی وب رو شروع میکنن و یا حتی کسانی که تجربه دارند به خوبی شناخته شده نباشه و گاهی اوقات باعث گیج ش
در این مطلب میخوام سایتی رو بهتون معرفی کنم که با استفاده از اون و بدون نیاز به کدنویسی میتونین دکمه های بسیار زیبا مطابق با مد روز رو بسازید و به سادگی ازشون در سایت خودتون استفاده کنید. همونطور که در سایت مشاهده میکنید، تعدادی دکمه از پیش تعریف شده قرار داده شده اند.
با استفاده از این بخش میتونین رنگ دکمه رو مشخص کنید
میتونین سایز دکمه رو مشخص کنید
میتونین کاری کنید که دکمه کل عرض المنت Parent ر
همونطور که اطلاع دارید در جلسه گذشته در مورد Class Expression و Class Declaration و first class citizen و ... صحبت کردیم. در این جلسه میخوایم مباحث مربوط به کلاسها رو ادامه بدیم و چیزهایی که مونده رو به اتمام برسونیم.
همونطور که اطلاع دارید در مبحث توابع IIFEs وجود دارند که مخفف Immediately Invoked Function Expression است. با استفاده از IIFE ها میتونین توابع رو تعریف کرده و بعد از اون و فوراً اون